<template>
	<view>
		<view class="QHclass" v-for="item in QihuangList">
			<!-- 插入视频 -->
			<video :src="item.qhLectureVideoUrl" class="vid"></video>
			<text class="day">{{ formattedData(item.qhLectureCreatetime) }}</text>
			<!-- 基本介绍 -->
			<view class="vidBasic">
				<text class="titleBasic">{{item.qhLectureName}}</text>
				<view class="contBasic">{{item.qhLectureIntroduction}}</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad(options) {
			// console.log(options.params)  
			const paramsStr = options.params; // 获取URL查询参数中的params字段    
			//接收订单页面传来的子商品id和商品数量  
			const QihuangList = JSON.parse(paramsStr); // 将参数字符串解析为对象  
			this.QihuangList = QihuangList
			console.log(this.QihuangList)
		},
		data() {
			return {
				QihuangList: {}
			};
		},
		methods: {
			//日期格式规范
			formattedData(dateStr) {
				const date = new Date(dateStr);
				const year = date.getFullYear();
				const month = date.getMonth() + 1; // 月份是从0开始的
				const day = date.getDate();

				return `${year}年${month}月${day}日`;
			}
		}


	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}

	.QHclass {
		padding: 0;
		margin: 0;
		position: relative;
		background-color: #FFFFFF;

		video {
			width: 100%;
			top: 24rpx;
			height: 424rpx;
		}

		.day {
			position: absolute;
			left: 544rpx;
			top: 464rpx;
			width: 193rpx;
			height: 36rpx;
			opacity: 1;
			/** 文本1 */
			font-size: 24rpx;
			font-weight: 400;
			letter-spacing: 0rpx;
			line-height: 34.76rpx;
			color: rgba(51, 51, 51, 1);
			text-align: left;
			vertical-align: top;

		}
	}

	.vidBasic {
		display: flex;
		flex-direction: column;
		padding: 0 28rpx;
		margin-top: 86rpx;

		.titleBasic {
			left: 28rpx;
			height: 46rpx;
			opacity: 1;
			/** 文本1 */
			font-size: 32rpx;
			font-weight: 700;
			letter-spacing: 0rpx;
			line-height: 45.98rpx;
			color: rgba(0, 0, 0, 1);
			text-align: left;
			vertical-align: top;
		}

		.contBasic {
			min-height: auto; // 使用min-height而不是height
			word-wrap: break-word; // 确保文本在必要时换行
			overflow: hidden; // 隐藏溢出部分

			margin-top: 20rpx;
			opacity: 1;
			font-size: 32rpx;
			font-weight: 300;
			letter-spacing: 0rpx;
			line-height: 46.34rpx;
			color: rgba(0, 0, 0, 1);

		}
	}
</style>